<template>
	<div>
		<mj-title type="h2" title="Divider 分割线"></mj-title>
		<div class="page-desc">区隔内容的分割线。</div>

		<mj-tabs class="mb50">
			<mj-tab-pane label="HTML" name="html">
				<mj-divider dashed>虚线</mj-divider>
				<div class="page-desc">风筝在阴天搁浅，想念还在等待救援，我拉着线复习你给的温柔。</div>

				<mj-divider></mj-divider>
				<div class="page-desc">铜镜映无邪，扎马尾，你若撒野，今生我把酒奉陪。</div>

				<mj-divider>分割线</mj-divider>
				<div class="page-desc">雨下整夜我的爱溢出就像雨水，窗台蝴蝶像诗里纷飞的美丽章节。我接着写把永远爱你写进诗的结尾，你是我唯一想要的了解。</div>

				<mj-divider txt-position="center">分割线</mj-divider>
				<div class="page-desc">看着那白色的蜻蜓，在空中忘了前进，还能不能重新编织，脑海中起毛球的记忆。</div>

				<mj-divider txt-position="right">分割线</mj-divider>
				<div class="page-desc">我一路向北，离开有你的季节，你说你好累，已无法再爱上谁。风在山路吹，过往的画面全都是不对，细数惭愧，我伤你几回。</div>

				<mj-divider txt-position="center" size="20">自定义文字大小</mj-divider>
			</mj-tab-pane>
			<mj-tab-pane label="CODE" name="code">
				<pre>
					<code class="language-html line-numbers">&lt;template>
						&lt;mj-divider dashed>虚线&lt;/mj-divider>
						&lt;mj-divider>&lt;/mj-divider>
						&lt;mj-divider>分割线&lt;/mj-divider>
						&lt;mj-divider txt-position="center">分割线&lt;/mj-divider>
						&lt;mj-divider txt-position="right">分割线&lt;/mj-divider>
						&lt;mj-divider txt-position="center" :size="20">自定义文字大小&lt;/mj-divider>
					&lt;/template>
					</code>
				</pre>
			</mj-tab-pane>
		</mj-tabs>

		<mj-title type="h5" title="API"></mj-title>
		<table class="api-table">
			<thead>
				<tr>
					<th>属性</th>
					<th>说明</th>
					<th>类型</th>
					<th>默认值</th>
				</tr>
			</thead>
			<tbody>
				<tr>
					<td>txt-position</td>
					<td>分割线标题的位置，可选值为 <code>left</code>、<code>right</code> 或 <code>center</code></td>
					<td>String</td>
					<td>left</td>
				</tr>
				<tr>
					<td>dashed</td>
					<td>是否虚线</td>
					<td>Boolean</td>
					<td>false</td>
				</tr>
				<tr>
					<td>size</td>
					<td>文字大小</td>
					<td>Number</td>
					<td>14</td>
				</tr>
			</tbody>
		</table>
	</div>
</template>
